// 入口文件
import Vue from 'vue';
import VueResource from 'vue-resource';
import moment from 'moment';
import Mint from 'mint-ui';
import Vuex from 'vuex';
import VuePreview from 'vue-preview';
import 'mint-ui/lib/style.css';


import './lib/mui/css/mui.min.css';
import './lib/mui/css/icons-extra.css';



import app from './App.vue';
import router from './router.js';

Vue.use(VuePreview);
Vue.use(VueResource);
Vue.use(Mint);
Vue.use(Vuex);
import {Header ,Swipe, SwipeItem, Lazyload, Button} from 'mint-ui';

Vue.http.options.root = 'http://vue.studyit.io';
Vue.http.options.emulateJSON = true;

// 定义全局时间格式的过滤器
Vue.filter('timeFilter',function(info,option = 'YYYY-MM-DD HH:mm:ss'){
    return moment(info).format(option);
})

// Vue.component(Header.name, Header)
// Vue.component(Swipe.name, Swipe);
// Vue.component(SwipeItem.name, SwipeItem);
// Vue.component(Button.name, Button);
// Vue.use(Lazyload);

// 创建vuex实例

// 每次刚进入网站的时候，肯定会调用main.js ,在刚调用的时候，先从本地存储中把购物车的数据读出来，放到store中去
var car = JSON.parse(localStorage.getItem('car') || '[]');
var store = new Vuex.Store({
    state:{
        // 将购物车中的商品所需要的值以对象的形式放入car中
        car:car
    },
    mutations:{
        addCar(state,carinfo){
            // 先判断购物车中是否已有此类商品  通过id 
            // 如果有的话只让此类商品的num值增加
            // 如果没有就让所有的数据都push进car数组中去
            // 假设没有此类商品用标识符标识一下
            var flag = false;
            state.car.some( item=>{
                if(item.id === carinfo.id){
                    item.count += parseInt(carinfo.count);
                    flag = true;
                    return true
                }
            })
            if(!flag){
                state.car.push(carinfo);
            }   
            // 当更新过car数组后，把更新的值存储到localStorage中
            localStorage.setItem('car',JSON.stringify(state.car));
        },

        // 购物车修改数量时传递给vuex
        upData(state,carinfo){
            state.car.some((item)=>{
                if(item.id == carinfo.id){
                    item.count = parseInt(carinfo.count);
                    return true;
                }
            });
             // 当更新过car数组后，把更新的值存储到localStorage中
             localStorage.setItem('car',JSON.stringify(state.car));
        },

        // 删除某项商品
        removeCarlist(state,id){
            state.car.some((item,i)=>{
                if(item.id == id){
                    state.car.splice(i,1);
                    return true;
                }
            });
             // 当更新过car数组后，把更新的值存储到localStorage中
             localStorage.setItem('car',JSON.stringify(state.car));
        },

        // 更新是否选中某项商品
        carSelectedUpdata(state,selinfo){
            state.car.some((item)=>{
                if(item.id == selinfo.id){
                    item.selected = selinfo.selectedval;
                }
            });
            // 更新过选中状态后，把更新的值存储在本地内存中
            localStorage.setItem('car',JSON.stringify(state.car));
        }
    },
    getters:{
        // 给购物车徽章绑定car里面的count值
        getAllCount(state){
            var c = 0;
            state.car.forEach(item => {
                c += item.count;
            });
            return c
        },

        // 给购物车页面绑定num数量框中初始值
        getCargoodsNum(state){
            var o = {};
            state.car.forEach(item=>{
                o[item.id]= item.count;
            })
            return o;
        },

        // 添加是否选中对象
        getCarSelected(state){
            var d = {};
            state.car.forEach(item=> {
                d[item.id] = item.selected;
            });
            return d;
        },

        // 勾选商品的件数和价格
        getCountAndPrice(state){
            var o = {
                count:0,
                price:0
            };
            state.car.forEach(item=>{
                if(item.selected == true){
                    o.count += item.count;
                    o.price += item.count * item.price
                }
            });
            return o;
        }
    }

})






var vm = new Vue({
    el:'#app',
    render: c=> c(app),
    router,
    store
})
